﻿<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>DHC Web Desinger</title>
    <!-- Le styles -->
    <link href="css/bootstrap.min.css" rel="stylesheet" />
    <link href="css/layoutit.css" rel="stylesheet" />
    <!-- <link rel="stylesheet" href="css/smoothness/theme.css" />
    <link rel="stylesheet" href="css/smoothness/jquery-ui.min.css" />
    <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <link href="css/multiple-select.css" rel="stylesheet" />
    <link href="css/spectrum.css" rel="stylesheet" /> -->
    <script type="text/javascript" src="js/jquery-2.0.0.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui20190221.js"></script>
    <!-- <script type="text/javascript" src="js/jquery.json.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script> -->
    <!-- <script type="text/javascript" src="js/BootstrapMenu.min.js"></script>
    <script type="text/javascript" src="js/BootstrapMenu.js"></script>
    <script type="text/javascript" src="js/multiple-select.js"></script>
    <script type="text/javascript" src="js/spectrum.js"></script> -->
    <!-- <script type="text/javascript" src="js/Designer20190221.js"></script> -->
    <style type="text/css">
        /*control-selected 为动态样式，需要加上 !important,优先级才能高于本身的样式*/
        .control-selected
        {
            border-style:solid !important;
            border-width:2px !important;
            border-color:#ddd !important;
        }
    </style>
    <script type="text/javascript">
        $(document).ready(function () {
    
            //设置高度
            $("body").css("min-height", $(window).height() - 90);
            $(".demo").css("min-height", $(window).height() - 160);
            $("#mainContent").resizable();
            //拖拽事件
            $(".sidebar-nav .lyrow, .sidebar-nav .box").draggable({
                helper: "clone",
                handle: ".drag",
                start: function (e, t) {
                    //SaveTemporHtml();
                    //InitCurC();
                },
                drag: function (e, t) {
                    //t.helper.width(250);
                },
                stop: function (e, t) {
                    //debugger;
                    //var curCT = t.helper.find("[controlType]").attr("controlType");
                    //var ret = Add(curCT, t.helper);
                    //SaveTemporHtml();
                }
            });
        
            //对于动态生成的html,使用delegate绑定事件，防止失效  shebin amend 2016-4-28
            $(document).delegate("#mainContent", "click", function (e) {
                $(".control-selected").removeClass("control-selected");
            });
        });
    </script>
</head>
<body style="min-height: 231px; cursor: auto;" class="edit">
<!-- 最上端的工具栏 -->
<div class="navbar navbar-inverse navbar-fixed-top" >
    
</div>

<!-- 下面的内容，分为左右结构 -->
<div class="container">
    <div class="row">
    <!-- 左边的控件栏 -->
    <div class="col-md-0">
        <div class="sidebar-nav">
            <!-- 数据控件；页面识别的表示为：box 样式 -->
            <ul class="nav nav-list accordion-group" id="inputControl">
                <li class="nav-header">录入控件</li>
                <li style="display:list-item;" class="boxes" id="elmComponents">
                    <div class="box box-element">
                        <div class="preview">
                            文本框<span class="drag label"><i class="icon-move"></i>拖动</span>
                        </div>
                        <div class="view">
                            <div controlType="text" style="width:200px; height:40px;" class="form-group">
                                <input type="text" class="form-control" style="font-family:SimSun;" id="text" placeholder="请输入文本信息" />
                            </div>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    

    <!-- 右边的主面板 -->
    <div class="col-md-12">
        <div style="min-height: 161px; padding-top:10px;" id="mainContent" class="demo ui-draggable ui-sortable" >
        </div>
    </div>

    <!-- 查看HTML的地方，先放着，到时候肯定要改造， -->
    <div id="download-layout">
      <div class="container"></div>
    </div>
  </div>
</div>
</body>
</html>